//封装弹窗组件

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';

class BottomSheetPage extends StatefulWidget {
  @override
  _BottomSheetPageState createState() => _BottomSheetPageState();
}

class _BottomSheetPageState extends State<BottomSheetPage> {
  String publishType = '请选择';

  ///接收群体类型
  String resTypeValue = '请选择';
  int resType = 0;
  //发布类型
  String pubulishType = '请选择';

  List teacherList = ['1', '3', '6'];
  List stuList = ['1', '3', '6'];
  List deparList = ['1', '3', '6'];

  ///原本是传过来的数据，如果是学生，教职工，部门
  String reslent = '请选择';

  //是否显示时间组件 true就是不显示
  bool isShowDatePicker = true;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('封装弹窗组件'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: [
            ElevatedButton(
              onPressed: () {
                showBottomSheet(
                    title: '发布类型',
                    dataList: ['立即发布', '稍后发布', '暂时不发布'],
                    callback: (value) {
                      if (value != null) {
                        setState(() {
                          publishType = value;
                          // reslent.
                          reslent = '请选择';
                        });
                      } else {}
                    });
              },
              child: Text('测试'),
            ),

            ///选择后的回调
            Text('选择后的类型：' + publishType),
            Divider(),

            ChooseItemWidget(
                tip: '接收群体',
                content: '$resTypeValue',
                isFlag: true,
                callback: () {
                  showBottomSheet(
                      title: '选择群体',
                      dataList: ['教职工', '学生', '部门'],
                      callback: (value) {
                        setState(() {
                          resTypeValue = value;
                        });
                      });
                }),
            DeepLine(),
            ChooseItemWidget(
                tip: '接收人员',
                content: '$reslent',
                isFlag: false,
                callback: () {
                  switch (resTypeValue) {
                    case '教职工':
                      setState(() {
                        reslent = teacherList.length.toString() + '人';
                        resType = 1;
                      });
                      break;
                    case '学生':
                      setState(() {
                        reslent = '你选择的是学生哦';
                        resType = 2;
                      });
                      break;
                    case '部门':
                      setState(() {
                        reslent = '你选择的是部门哦';
                      });
                      break;

                    default:
                      break;
                  }
                }),
            DeepLine(),
            TextInputItemWidget(tip: '发布组织', callback: (value) {}),
            DeepLine(),

            ChooseItemWidget(
              tip: '发布类型',
              content: '$pubulishType',
              isFlag: true,
              callback: () {
                showBottomSheet(
                    title: '发布类型',
                    dataList: ['立即发布', '定时发布', '不发布'],
                    callback: (value) {
                      if (value != null) {
                        setState(() {
                          pubulishType = value;
                          if (value == '定时发布') {
                            isShowDatePicker = false;
                          } else {
                            isShowDatePicker = true;
                          }
                        });
                      }
                    });
              },
            ),
            DeepLine(),
            MockTimePicker()
          ],
        ),
      ),
    );
  }

  ///再封装一条线
  Widget DeepLine() {
    return Divider(
      height: 1,
      color: Colors.grey,
    );
  }

  ///需要分类
  ///1，输入框
  ///所对应的是输入的组件，有hintText提示内容，所以就不要传入发布的类型。
  ///2，选择框
  ///点击事件和回调之后，所需显示的东西

  ///选择框的
  Widget ChooseItemWidget(
      {String tip = '',
      String content,
      bool isFlag = false,
      Function callback}) {
    return GestureDetector(
      onTap: callback,
      child: Container(
        child: Padding(
          padding: EdgeInsets.all(10.w),
          child: Row(
            children: [
              Padding(
                padding: EdgeInsets.all(5.w),
                child: Text(
                  '*',
                  style: TextStyle(color: Colors.red, fontSize: 13.sp),
                ),
              ),
              Text(
                '$tip:',
                style: TextStyle(color: Colors.grey, fontSize: 13.sp),
              ),
              SizedBox(
                width: 6,
              ),
              Expanded(
                child: Text(
                  '$content',
                  style: TextStyle(fontSize: 12.sp, color: Colors.black),
                ),
              ),
              isFlag
                  ? Icon(Icons.chevron_right)
                  : Icon(Icons.person_add_alt_1_outlined),
            ],
          ),
        ),
      ),
    );
  }

  ///
  Widget MockTimePicker() {
    return Offstage(
      offstage: isShowDatePicker,
      child: Center(
        child: Container(
          child: Text('you know that'),
        ),
      ),
    );
  }

  ///这边做了什么事情，自定义需要传入的参数，
  ///定义每个item的显示样式，
  ///将每个传入的参数，显示在对应的位置。
  ///
  ///

  Widget TextInputItemWidget({String tip = '', Function(String) callback}) {
    return Container(
      height: 52.h,
      // color: Colors.red,
      child: Padding(
        padding: EdgeInsets.only(),
        child: Row(
          children: [
            Padding(
              padding: EdgeInsets.all(5),
              child: Text(
                '*',
                style: TextStyle(fontSize: 14, color: Colors.red),
              ),
            ),
            Padding(
              padding: EdgeInsets.all(10),
              child: Text(
                '$tip:',
                style: TextStyle(color: Colors.grey, fontSize: 13.sp),
              ),
            ),
            Expanded(
              child: TextField(
                onChanged: (value) {
                  callback(value);
                },
                maxLines: 1,
                decoration: InputDecoration(
                  border: InputBorder.none,
                  hintText: '请输入',
                  hintStyle: TextStyle(fontSize: 13, color: Colors.black),
                ),
              ),
            )
          ],
        ),
      ),
    );
  }

  Widget TextFiledTextWidget({String tip = '', Function(String) callback}) {
    return Container(
      child: Padding(
          padding: EdgeInsets.all(10),
          child: Row(
            children: [
              Text(
                '*',
                style: TextStyle(color: Colors.red, fontSize: 13),
              ),
              Text(
                '$tip:',
                style: TextStyle(fontSize: 15, color: Colors.grey),
              ),
              Expanded(
                child: TextField(
                  ///输入改变的回调
                  onChanged: (value) {
                    callback(value);
                  },
                  maxLines: 1,
                  decoration: InputDecoration(
                    ///内填充
                    contentPadding: EdgeInsets.all(0),

                    ///去除输入框底部的字符计数
                    counterText: '',
                    border: InputBorder.none,
                    hintText: '请输入',
                    hintStyle: TextStyle(fontSize: 14, color: Colors.grey),
                  ),
                ),
              ),
            ],
          )),
    );
  }

  void showBottomSheet(
      {String title = '', List<String> dataList, Function(String) callback}) {
    showModalBottomSheet(
        context: context,
        builder: (_) {
          return Container(
            height: 200,
            child: Column(
              children: [
                Padding(
                  padding: EdgeInsets.all(10.w),
                  child: Text(
                    '$title',
                    style: TextStyle(
                      color: Colors.red,
                      fontSize: 15,
                    ),
                  ),
                ),
                Expanded(
                    child: Column(
                        children: List.generate(dataList.length, (index) {
                  String value = dataList[index];
                  return GestureDetector(
                    onTap: () {
                      callback(value);
                      Get.back();
                    },
                    child: Padding(
                      padding: EdgeInsets.all(10),
                      child: Text('$value'),
                    ),
                  );
                }))),
              ],
            ),
          );
        });
  }

  void showChosePublishType(
      {String title = "", List<String> dataList, Function(String) callback}) {
    // double height = MediaQuery.of(context).size.height / 3 - 30;
    showModalBottomSheet(
        context: context,
        builder: (_) {
          return Container(
            height: 500,
            child: Column(
              children: [
                Padding(
                  padding: EdgeInsets.all(10),
                  child: Text(
                    '$title',
                    style: TextStyle(color: Colors.red),
                  ),
                ),
                Expanded(
                  child: Column(
                    children: List.generate(dataList.length, (index) {
                      String value = dataList[index];
                      return GestureDetector(
                        onTap: () {
                          Get.back();
                          callback(value);
                        },
                        child: Padding(
                          padding: EdgeInsets.all(10),
                          child: Text(
                            '$value',
                            style: TextStyle(color: Colors.grey, fontSize: 14),
                          ),
                        ),
                      );
                    }),
                  ),
                ),
              ],
            ),
          );
        });
  }
}
